<template>
  <div class="wrap">
  		<!-- header -->
  		<headerV></headerV>
  	
  		<!-- content -->
  		<div class="index-content">
			<div class="about">
				<div class="title">
					<router-link to="">关于我们</router-link>
				</div>
				<div class="content">
					<p>坐落在“全国工业旅游示范点”的xxx集团公司，是集旅游观光，餐饮、住宿、会议接待，商务活动等三星级涉外酒店(现正在积极申报四星)。酒店整个建筑为仿古庭院式建筑，占地—万三千二百平方米，酒店开业十多年来，始终瞄准向国内一流酒店学习，通过科学管理，培养了一大批管理人才，取得了不菲的成绩。xx酒店曾被国家旅游局评为“全国最佳星级饭店”。</p>
					<img src="../assets/cp1_l47k.jpg" class="about_pic" alt="" />
					<div class="msg_about">
						<div class="num">
							<strong>8500</strong>
							<span>+</span>
							<p>服务8500多个客户均获好评</p>
						</div>
						<div class="com">
							<router-link to="">查看详情</router-link>
							<img src="../assets/morexian_06.png" alt="" />
						</div>
					</div>
				</div>
			</div>
			<div class="guest">
				<div class="title">
					<router-link to="">客房中心</router-link>
				</div>
				<div class="content">
					<p>上千套房间任君挑选，一次给你奇妙之旅自助退订，科技服务 舒适有度，当之无愧 让酒店回归居家本质</p>
					<ul class="con">
						<li>
							<router-link to=""><img src="../assets/cp6_loqv.jpg" alt="" /></router-link>	
							<router-link to="">豪华海景套房</router-link>
						</li>
						<li>
							<router-link to=""><img src="../assets/cp5_a8sv.jpg" alt="" /></router-link>	
							<router-link to="">尊贵海景套房</router-link>
						</li>
						<li>
							<router-link to=""><img src="../assets/cp4_yjor.jpg" alt="" /></router-link>	
							<router-link to="">尊贵海景套房</router-link>
						</li>
						<li>
							<router-link to=""><img src="../assets/cp3_rv2z.jpg" alt="" /></router-link>	
							<router-link to="">行政海景套房</router-link>
						</li>
						<li>
							<router-link to=""><img src="../assets/cp2_jiv9.jpg" alt="" /></router-link>	
							<router-link to="">海景套房</router-link>
						</li>
						<li>
							<router-link to=""><img src="../assets/cp1_l47k (1).jpg" alt="" /></router-link>	
							<router-link to="">尊贵海景套房</router-link>
						</li>
					</ul>
					<div class="why">
						<strong>为什么选择我们</strong>
					</div>
					<ul class="sel">
						<li>
							<div class="icon"><img src="../assets/k85e.png" alt="" /></div>
							<p>精心挑选的地段</p>
							<span>提供全新的定制旅游路线和酒店住宿，让您旅行更安心。</span>
						</li>
						<li>
							<div class="icon"><img src="../assets/14s1.png" alt="" /></div>
							<p>一流的服务</p>
							<span>多条旅游路线供您选择，一站式服务提供，让您旅行更安心。</span>
						</li>
						<li>
							<div class="icon"><img src="../assets/o0g2.png" alt="" /></div>
							<p>贴心管家</p>
							<span>高级酒店、全程直飞，100%用心服务，让您旅行更安心。</span>
						</li>
					</ul>
				</div>
			</div>
			<div class="service">
				<div class="title">
					<router-link to="">特色项目</router-link>
				</div>
				<div class="content">
					<p>上千套房间任君挑选，一次给你奇妙之旅自助退订，科技服务 舒适有度，当之无愧 让酒店回归居家本质</p>
					<div class="carousel">
						<swiper auto loop height='1.87rem'>
							<swiper-item><img src="../assets/tese1.jpg" /></swiper-item>
							<swiper-item><img src="../assets/tese2.jpg" /></swiper-item>
							<swiper-item><img src="../assets/tese3.jpg" /></swiper-item>
							<swiper-item><img src="../assets/tese4.jpg" /></swiper-item>
					 	</swiper>
					</div>
					<div class="desc">
						<p>特色养生SPA、健身、美食</p>
						<p>酒店开业以来，曾多次成功接待党和国家领导人、社会名流，文人墨客和港、澳、台同胞，及来自世界各地的外宾，留下了—片对汾酒文化的赞誉声，通过宾馆这个窗口，搭起了一座集团公司与外界沟通和传播文化的友谊桥梁。住宿：高、中档次套间9套，二人标准房间80间。会议接待：能容纳250人，多功能会议厅1个，中小型会议接待室7个。</p>
						<router-link to="" class="btn">查看详情</router-link>
					</div>
				</div>
			</div>
			<div class="news">
				<div class="title">
					<router-link to="">新闻中心</router-link>
					<p>NEWS</p>
				</div>
				<div class="content">
					<img src="../assets/new_01.jpg" alt="" />
					<ul>
						<li>
							<router-link to="">出境提示：旅游局提示暂缓赴牙买加旅游</router-link>
							<p class="time">2017-9-27</p>
						</li>
						<li>
							<router-link to="">以色列入境旅游增速显著 2012欲达全球400万游客</router-link>
							<p class="time">2017-9-27</p>
						</li>
						<li>
							<router-link to="">美联航客机遇乱流下坠 致至少6名乘客受伤</router-link>
							<p class="time">2017-9-27</p>
						</li>
						<li>
							<router-link to="">个人赴日游门槛降低 持信用卡金卡可申请签证</router-link>
							<p class="time">2017-9-27</p>
						</li>
						<li>
							<router-link to="">夏季出游需预防中暑</router-link>
							<p class="time">2017-9-27</p>
						</li>
						<li>
							<router-link to="">四川千里自驾 黯然掠过北川灾后的余伤</router-link>
							<p class="time">2017-9-27</p>
						</li>
					</ul>
				</div>
			</div>
  		</div>
  	
	  	<!-- footer -->
	  	<footerV></footerV>
  </div>
</template>

<script>
import {Swiper, SwiperItem} from 'vux'
import footer from './public/footer'
import header from './public/header'
export default {
	components: {
		footerV : footer,
		headerV : header,
		Swiper, SwiperItem
	},
	data () {
		return {
			
		}
	},
	methods : {
		
	}
}
	
</script>


<style type="text/css" scoped="scoped">
	/* index.style */
	.about .content>p{
		color:#5A5A5A; padding: 0 0.08rem; line-height: 0.22rem;
	}
	.about .about_pic{
		width:100%; margin: 0.1rem auto; height:2rem;
	}
	.about .msg_about{
		padding: 0 0.1rem; margin-bottom: 0.15rem; overflow: hidden;
	}
	.about {
		overflow: hidden;
	}
	.about .num {
		float: left;
	}
	.about .num strong{
		font-size: 0.35rem; margin: 0.04rem auto; display: inline-block;
	}
	.about .num span{
		font-size: 0.24rem;
	}
	.about .com{
		float: right;
	}
	.about .com a{
		color: rgba(67,67,67,1); float: left; margin-top: 0.25rem; margin-right: 0.1rem; display: inline-block;
	}
	.about .com img{
		width:0.08rem; height:0.65rem;
	}
	
	.guest{
		overflow: hidden;
	}
	.guest .content>p{
		padding: 0 0.1rem; color: rgb(102, 102, 102);background: rgb(245, 245, 245);  line-height: 0.22rem; text-align: center; margin-bottom: 0.1rem;
	}
	.guest .title{
		background: rgb(245, 245, 245); 
	}
	.guest .content .con{
		overflow: hidden; padding: 0 0.05rem; background: rgb(245, 245, 245);  padding-bottom: 0.3rem;
	}
	.guest .content .con li{
		width:48%; float: left; text-align: center;
	}
	.guest .content .con li:nth-of-type(2n){
		margin-left: 0.12rem;
	}
	.guest .content .con img{
		width:100%;
	}
	.guest .content .con a{
		color: #434343; font-weight: bold; margin: 0.05rem auto; display: inline-block;
	}
	.guest .why{
		width:100%; height: 1.6rem; margin-bottom:0.2rem; background: url(../assets/nybn.jpg) center center no-repeat; text-align: center; background-size:100% 100% !important;
	}
	.guest .why strong{
		color: #fff; font-size: 0.24rem; line-height: 1.6rem; display: inline-block;
	}
	
	.guest .sel{
		padding: 0 0.1rem;
	}
	.guest .sel li{
		padding: 0 0.15rem; height:1.4rem; position: relative; background: rgb(246, 246, 246); margin-top: 0.6rem; text-align: center;
	}
	.guest .sel li img{
		 width:0.25rem; height: 0.25rem; background: #b63327; padding: 0.2rem;
	}
	.guest .sel li .icon{
		width: 0.65rem; height: 0.65rem; position: relative; top:-0.35rem; overflow: hidden; border-radius: 50%; margin: 0 auto;
	}
	.guest .sel li p{
		font-size: 0.16rem; margin: -0.2rem 0 0.2rem;
	}
	
	.service{
		background: rgb(245, 245, 245); padding:0 0.06rem; overflow: hidden; margin-top:0.4rem; text-align: center;
	}
	.service .content>p{
		color: rgb(102, 102, 102); padding: 0 0.1rem;
	}
	.service .carousel{
		height:1.87rem; width:100%; margin: 0.1rem auto; overflow: hidden;
	}
	.service .carousel img{
		width:100%;
	}
	.service .desc p:nth-of-type(1){
		color: rgb(182, 51, 39); font-size: 0.15rem; margin: 0.1rem auto;
	}
	.service .desc p:nth-of-type(2){
		color: #5A5A5A; line-height: 0.22rem;
	}
	.service .desc .btn{
		width:1.2rem; height: 0.4rem; background: rgba(182,51,39,1); color: #fff; line-height: 0.4rem; text-align: center; display: block; margin: 0.2rem auto 0.3rem;
	}
	
	.news .content>img{
		width: 100%;
	}
	.news .content ul{
		padding: 0 0.1rem; overflow: hidden;
	}
	.news .content li{
		width: 100%; border-bottom: 0.01rem dashed #eee; margin-bottom: 0.1rem; padding-bottom: 0.1rem;
	}
	.news .content li a{
		color: #5A5A5A; line-height: 0.25rem;
	}
	.news .content li a:hover{
		color:#b63327;
	}
	.news .content li p{
		color:#929292;
	}
</style>
<style type="text/css">
	.service .vux-slider .vux-indicator{
		display:none !important;
	}
</style>
